import React from "react";
import { Input, Typography } from "antd";
import { QuestionInputDefaultProps, QuestionInputPropsType } from "./interface";
import useQuestionPageType from "../../../../hooks/useQuestionPageType";
import { genFontSize } from "../../../../utils/common";
import commonStyles from "../common.module.scss";

const QuestionInput: React.FC<QuestionInputPropsType> = (
  props: QuestionInputPropsType
) => {
  const { title, placeholder, prompt } = {
    ...QuestionInputDefaultProps,
    ...props,
  };
  // 判断当前页面，如果是统计页则选中提示答案
  const { isStatPage } = useQuestionPageType();

  return (
    <div>
      <Typography.Title
        level={5}
        style={{
          fontSize: genFontSize(5),
        }}
        className={commonStyles.h5}
      >
        {title}
      </Typography.Title>
      <Input placeholder={placeholder} value={isStatPage ? prompt : ""}></Input>
    </div>
  );
};

export default QuestionInput;
